<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>DOM追加元素</title>
	</head>
	<body>
		<div>
			<p style="">abc</p>
			<!-- 使用DOM加一个p标签，字体变蓝色，文本内容是123 -->
		</div>
		<div>
			
		</div>
	</body>
	<script>
		// DOM：一个特殊的对象，表示当前网页文档的对象
		// 1.使用DOM创建一个p标签
		var p = document.createElement('p') // p标签的对象
		// 2.使用DOM修改p标签的文本和样式
		p.innerText = '123'
		p.style.color = '#00F'
		// 3.定位到目标div
		// 获取的结果相当于是装了所有div对象的数组
		var divs = document.getElementsByTagName('div')
		var div = divs[0] // 取第一个
		// 4.将p标签追加到div内部
		div.appendChild(p)
	</script>
</html>